$(document).ready(function() {
	
	// localization
	var messages = {
		serverCommunicationError: 'Ocorreu um erro na comunicação com o servidor.',
	    loadingMessage: 'A carregar ...',
	    noDataAvailable: 'Sem dados!',
	    addNewRecord: '+ Adicionar Extra',
	    editRecord: 'Editar Registo',
	    areYouSure: 'Tem a certeza?',
	    deleteConfirmation: 'Este registo será eliminado. Tem a certeza?',
	    save: 'Guardar',
	    saving: 'A guardar',
	    cancel: 'Cancelar',
	    deleteText: 'Eliminar',
	    deleting: 'A eliminiar',
	    error: 'Erro',
	    close: 'Fechar',
	    cannotLoadOptionsFor: 'Não foi possivel carregar as opções do campo {0}',
	    pagingInfo: 'Mostrando {0} até {1} de {2} registos',
	    canNotDeletedRecords: 'Não foi possivel eliminar {0} de {1} registos!',
	    deleteProggress: 'Eliminado {0} de {1} registos, processando...'
	};
	
	$('#TableContainer').jtable({
	
		// Field Options
		title:					'Extras',
		paging:					false,
		sorting:				false,
		deleteConfirmation:		true,
		dialogShowEffect:		'fade',	
	    dialogHideEffect:		'fade',
	    selectOnRowClick:		false,
	    selectingCheckboxes:	false,
	    selecting:				false,
	    multiselect:			false,
	    // this flag by default is set to 'true'. Is so, and if the the columns from jtable are selected
	    // a error message 'disallowed key characters' will be displayed
	    saveUserPreferences:	false,
	    messages: 				messages,
	
		// Actions
		actions: {
	        createAction: 	window.ajaxUrl + '/jtableCreateExtra',
	        listAction: 	window.ajaxUrl + '/jtableReadExtra',
	        updateAction: 	window.ajaxUrl + '/jtableUpdateExtra',
	        deleteAction: 	window.ajaxUrl + '/jtableDeleteExtra'
		},
	
		// Show Fields
		fields: {
			id: {
				key:			true,
				edit:			false,
				create:			false,
				list:			false
			},
			name: {
				title:			'Nome',
				width:			'25%',
				type:			'text',
				edit:			true,
	            create:			true,
	            list:			true,
	            inputClass: 	'validate[required]'
			},
			price: {
				title:			'Preco',
				width:			'6%',
				type:			'text',
				edit:			true,
	            create:			true,
	            list:			true,
	            inputClass: 	'validate[required,custom[number]]'
			},
			active: {
				title:			'Activo',
				width:			'6%',
	            type:			'checkbox',
	            values:			{'0':'no','1':'yes'},
	            setOnTextClick:	false,
	            defaultValue:	'1',
				edit:			true
				//create:			true,
				//list:			true
			},
			included_in_offer: {
				title:			'Disponivel nas ofertas?',
				width:			'13%',
				type:			'checkbox',
				values:			{'0':'não','1':'sim'},
	            setOnTextClick:	false,
	            defaultValue:	'0'
			},
			description: {
				title:			'Descrição',
				width:			'50%',
				type:			'textarea',
				list:			true
			},
		},
		
		// INI validation Logic
		formCreated: function(event,data) {
			data.form.validationEngine();
		},
		
		// Validate
		formSubmitting: function(event, data) {
			return data.form.validationEngine('validate');
		},
		
		// Dispose validation logic when form is closed
        formClosed: function (event, data) {
            data.form.validationEngine('hide');
            data.form.validationEngine('detach');
        }
	});
	//call readeOfferAction and load data from server into the table
	$('#TableContainer').jtable('load');
});
